<template>
  <div>
    <el-button @click="onSummary">合并表格</el-button>
    <el-button @click="onSingleSelect">单选表格</el-button>
    <el-button @click="onUploadImgPreview">图片预览表格</el-button>
    <el-button @click="onMultiSelect">多选表格</el-button>
  </div>
</template>

<script setup>
import Summary from "@/components/Table/Summary.vue"
import SingleSelect from "@/components/Table/SingleSelect.vue"
import UploadImgPreview from "@/components/Table/UploadImgPreview.vue"
import MultiTable from "@/components/Table/MultiTable.vue"

import { getCurrentInstance } from "vue"

const { proxy } = getCurrentInstance()
const onSummary = () => {
  proxy.$dialog(
    Summary,
    {
      on: {
        ok: () => alert("ok vue3")
      }
    },
    {
      width: 600,
      okText: "确定",
      cancelText: "取消"
    }
  )
}
const onSingleSelect = function() {
  proxy.$dialog(
    SingleSelect,
    {
      on: {
        ok: () => alert("ok vue3")
      }
    },
    {
      width: 600,
      okText: "确定",
      cancelText: "取消"
    }
  )
}
const onMultiSelect = function() {
  proxy.$dialog(
    MultiTable,
    {
      on: {
        ok: () => alert("ok vue3")
      }
    },
    {
      width: 600,
      okText: "确定",
      cancelText: "取消"
    }
  )
}
const onUploadImgPreview = function() {
  proxy.$dialog(
    UploadImgPreview,
    {
      on: {
        ok: () => alert("ok vue3")
      }
    },
    {
      width: 600,
      okText: "确定",
      cancelText: "取消"
    }
  )
}
</script>
